import { createRouter, createWebHashHistory } from "vue-router";
// import Home from "../views/Index.vue";

const routes = [
  {
    // 重定向
    path: "/",
    redirect: "/home",
  },
  {
    path: "/home",
    redirect: "/home/main",
    component: () => import("../views/Index.vue"),
    children: [
      {
        //主页
        path: "/home/main",
        props: true,
        component: () => import("../components/home/Main"),
        meta: {
          keepAlive: true,
        },
      },
      {
        //list（含参）
        path: "/home/list",
        props: true,
        component: () => import("../components/home/List"),
        meta: {
          keepAlive: false,
          reqireLogin: true,
        },
      },
      {
        //成就（含参）
        path: "/home/achievement",
        props: true,
        component: () => import("../components/home/Achievement"),
        meta: {
          reqireLogin: true,
          keepAlive: false,
        },
      },

      {
        //mine （含参）
        path: "/home/mine",
        props: true,
        component: () => import("../components/home/Mine"),
        // meta表示元信息，里面可以写任何对象
        meta: {
          reqireLogin: true,
          keepAlive: true,
        },
      },
    ],
  },
  {
    path: "/login",
    component: () => import("../views/Login"),
  },
  {
    path: "/exercise",
    component: () => import("../views/Exercise"),
    // 路由独享守卫
    // 语法和功能和全局前置守卫完全相同
    // 只有要进入这个页面才会执行
    // beforeEnter: (to, from, next) => {
    //   if (localStorage.getItem("token")) {
    //     next();
    //   } else {
    //     next("/login");
    //   }
    // },
  },
  {
    // 成就详情（含参）
    path: "/totoachievement",
    component: () => import("../views/Totoachi"),
    props: true,
  },
  {
    // 成就详情（含参）
    path: "/lesson/:id",
    component: () => import("../views/Lesson"),
    props: true,
  },
  {
    // 设置路由（含参）
    path: "/setting",
    props: true,
    component: () => import("../views/Setting"),
  },
  {
    // 注册路由
    path: "/reg",
    component: () => import("../views/Reg"),
    props: true,
  },
  {
    // 注册2路由
    path: "/reg2",
    component: () => import("../views/Reg2"),
    props: true,
  },
  {
    // 钻石路由（含参）
    path: "/vip",
    component: () => import("../views/Vip"),
    props: true,
  },
  {
    // 邀请路由（含参）
    path: "/invite",
    component: () => import("../views/Invite"),
    props: true,
  },

  {
    // 检测路由
    path: "/tests",
    component: () => import("../views/Tests"),
    props: true,
  },
  {
    // 404路由
    path: "/:pathMatch(.*)*",
    component: () => import("../views/NotFound"),
  },
];

const router = createRouter({
  history: createWebHashHistory(),
  routes,
});

// 全局的前置守卫
// 只要有路由切换就会执行
router.beforeEach((to, from, next) => {
  // console.log(to);
  // console.log(from);

  // document.title = to.meta.title || "娱乐看猫眼";
  // 路由鉴权
  // 判断去的页面是否需要登录
  if (to.meta.reqireLogin) {
    // 判断现在是否已经登录
    if (localStorage.getItem("token")) {
      next();
    } else {
      next("/login");
    }
  } else {
    next();
  }

  // next()表示放行
  // next(false)表示不放行
  // next("/login")表示重定向
});

// 全局的后置钩子
// router.afterEach((to) => {
//   document.title = to.meta.title || "aikeApp";
// });
//抓住错误- -
// const originalPush = VueRouter.prototype.push;
// VueRouter.prototype.push = function push(location) {
//   return originalPush.call(this, location).catch((err) => err);
// };

export default router;
